<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="./jquery-3.7.1.min.js"></script>
</head>
<body>
    <div id="box1">
        <p>hello</p>
        <span>world</span>
    </div>

    <div id="box2">
        <p>hello</p>
        <span>world</span>
    </div>

    <div id="box3">
        <p id="text">Hello</p>
    </div>

    <script>
        // 1.empty() 清空元素内容
        $('#box1').empty()

        // 2.remove() 删除元素
        $('#box2').remove()

        // 3.replaceAll() 替换元素
        $('<div>替换</div>').replaceAll('#text')

        // 4.replaceWith() 替换元素
        // $('#text').replaceWith('<div>替换</div>')
    </script>
</body>
</html>